
import { Empty, Pagination, Table } from "antd"
import { useEffect } from "react"
import emptyImage from "../../assets/image/反馈／异常／空态@2x.png"
import { $eventBus } from "../../common/utils"
import lessModule from "./index.module.less"

// 主页-数据管理页面-表格组件
interface homePageDataManagementPageSiteAccountPageTableComponentPropsInterface {
    columnList: Array<object>
    sourceData: object
    get_pagination: Function
}
const HomePage_DataManagementPage_SiteAccountPage_TableComponent: React.FC<homePageDataManagementPageSiteAccountPageTableComponentPropsInterface> = (props) => {
    const className_tableRow = (record: object, idx: number) => {
        return idx % 2 ? `${lessModule["layerComponentRightBottomComponent-main__tableRow"]}` : ""
    }

    const change_pagiationData = (page: number, pageSize: number) => {
        props.get_pagination(page, pageSize)

    }

    const eventBus_on = () => {
        // 数据管理页面-头部菜单查询
        $eventBus.addListener("eventBus_tableSearchConditionData", (res) => {

        })
    }

    const eventBus_off = () => {
        // 数据管理页面-头部菜单查询
        $eventBus.removeAllListeners("eventBus_tableSearchConditionData")
    }
    useEffect(() => {
        eventBus_on()
        return () => {
            eventBus_off()
        }
    }, [])

    return (
        <div className={`${lessModule["homePageDataManagementPageSiteAccountPageTableComponent"]}`}>
            <Table rowKey={(record) => record["idx"]} scroll={{ y: "calc(100vh - 64px - 16px - 32px - 68px - 105px)" }} locale={{
                emptyText: <Empty image={emptyImage} imageStyle={{
                    width: 64,
                    height: 42,
                }} />
            }}
                columns={props.columnList}
                dataSource={props.sourceData["data"]}
                pagination={false}
                rowClassName={className_tableRow}
            />
            <Pagination
                total={props.sourceData["total"]}
                showSizeChanger
                showQuickJumper
                showTotal={(total) => `共${props.sourceData["total"]}条`}
                defaultPageSize={17}
                pageSizeOptions={["10", "17", "50"]}
                onChange={change_pagiationData}
            />
        </div>
    )
}

export default HomePage_DataManagementPage_SiteAccountPage_TableComponent